<!--
 * @Description: 
 * @Version: 1.0
 * @Autor: gaoluo
 * @Date: 2021-11-09 15:16:28
 * @LastEditors: gaoluo
 * @LastEditTime: 2021-11-10 16:15:07
 * @FilePath: /nhw/src/views/Work/Snapshot/SnapshotRepeated.vue
-->
<template>
  <Layout class="snapshot-repeated-container" title="随手拍重复订单" border>
    <PullRefresh v-model="isLoading" @refresh="onRefresh">
      <List
        v-show="orderList.length > 0"
        v-model="loading"
        :finished="finished"
        :immediate-check="false"
        finished-text="没有更多了"
        @load="onLoad"
      >
        <Card
          v-for="item in orderList"
          :key="item.rpcNo"
          class="list-item"
          @click="toDetail(item.rpcNo, item.stateName)"
        >
          <CardTitle
            class="item-container"
            text="随手拍编号"
            :listId="item.rpcId"
            :state="+item.state"
            :stateText="item.stateName"
            :adorn="false"
          />
          <CardTwig
            :left="item.rpcName"
            style="color: #696d73"
            border
            strong
            adorn
          />
          <CardTwig left="联系人" :right="item.findUser" />
          <CardTwig left="联系人电话" :right="item.findMobile" />
          <CardTwig left="发现时间" :right="item.firstDtm" />
          <!-- <CardBtn /> -->
        </Card>
      </List>
      <Empty
        image="error"
        description="无数据"
        v-show="orderList.length <= 0"
      />
    </PullRefresh>
  </Layout>
</template>

<script>
import Layout from "components/Layout";
import { Icon, List, Empty, PullRefresh } from "vant";
import Card from "components/Card";
import CardTwig from "components/Card/CardTwig";
import CardTitle from "components/Card/CardTitle";
import { problemClapList } from "@/api/work.js";
export default {
  name: "SnapshotRepeated",
  components: {
    Layout,
    Card,
    CardTitle,
    CardTwig,
    Icon,
    List,
    Empty,
    PullRefresh,
  },
  data() {
    return {
      orgNo: "",
      loading: false, //下拉加载更多的loading状态
      finished: false,
      isLoading: false,
      pageNum: 1,
      orderList: [],
    };
  },
  created() {
    this.orgNo = window.localStorage.getItem("orgNo");

    this.getList().then((res) => {
      this.orderList = res;
    });
  },
  methods: {
    //加载更多
    onLoad() {
      this.pageNum++;
      this.getList().then((res) => {
        this.orderList.push(...res);
        this.loading = false;
      });
    },
    //下拉刷新
    onRefresh() {
      this.pageNum = 1;
      this.finished = false;
      this.getList().then((res) => {
        this.isLoading = false;
        this.orderList = res;
      });
    },
    //跳转详情页
    toDetail(value, stateName) {
      this.$router.push({
        name: "SnapshotDetails",
        query: { rpcNo: value, stateName },
      });
    },
    async getList() {
      const res = await problemClapList({
        point: this.$route.query.point,
        orgNo: this.orgNo,
        pageNum: this.pageNum,
        pageSize: 10,
      });
      if (res.param.sumPage == this.pageNum || res.param.data.length <= 0) {
        this.finished = true;
      }
      return res.param.data;
    },
  },
};
</script>

<style lang="less" scoped>
.snapshot-repeated-container {
  .van-list {
    background: #f7f7f9;
    min-height: 70vh;
    .list-item {
      margin-bottom: 20px;
      background: #fff;
    }
  }

  .van-pull-refresh {
    min-height: 100%;
  }
}
</style>